<template>
  <div>
    <!-- 导航面包屑 -->
    <el-card>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>会员管理</el-breadcrumb-item>
        <el-breadcrumb-item>成长值规则</el-breadcrumb-item>
      </el-breadcrumb>
      <h3>成长值规则</h3>
    </el-card>
    <el-card class="ju-li">
      <el-row>
        <el-col :span="24">基础任务</el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="2">
          <el-checkbox class="bunn" v-model="checked">登录获成长值</el-checkbox>
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!checked"
            v-model="input1"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="2">
          <el-checkbox class="bunn" v-model="a">注册获成长值</el-checkbox>
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!a"
            v-model="input2"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="3">
          <el-checkbox class="bunn" v-model="ab">完善资料获成长值</el-checkbox>
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!ab"
            v-model="input3"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
    </el-card>
    <el-card class="ju-li">
      <el-row>
        <el-col :span="24">订单任务</el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="3">
          <el-checkbox v-model="abc">每次买1次，获成长值</el-checkbox>
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!abc"
            v-model="input4"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="2">
          <el-checkbox v-model="abcd">订单每满</el-checkbox>
        </el-col>
        <el-col :span="4">
          <el-input
            class="ypt"
            :disabled="!abcd"
            v-model="input5"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
        <el-col :span="2">
          <span class="bunn"> 获成长值</span>
        </el-col>
        <el-col :span="4">
          <el-input
            class="ypt"
            :disabled="!abcd"
            v-model="input6"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="2">
          <el-checkbox class="bunn" v-model="abcde">订单总额的</el-checkbox>
        </el-col>
        <el-col :span="4">
          <el-input
            class="ypt"
            :disabled="!abcde"
            v-model="input7"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
        <el-col :span="10">
          <span class="bunn">%获成长值</span>
        </el-col>
      </el-row>
    </el-card>
    <el-card>
      <el-row>
        <el-col :span="24">运营任务</el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="3">
          <el-checkbox class="bunn" v-model="abcdef"
            >每次分享，或成长值</el-checkbox
          >
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!abcdef"
            v-model="input8"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="3">
          <el-checkbox class="bunn" v-model="abcdefg"
            >邀请新用户，获成长值</el-checkbox
          >
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!abcdefg"
            v-model="input9"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="dlhq" :span="2">
          <el-checkbox class="bunn" v-model="checked1">每日签到</el-checkbox>
        </el-col>
        <el-col :span="10">
          <el-input
            class="ypt"
            :disabled="!checked1"
            v-model="input10"
            placeholder="请输入内容"
          ></el-input>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <el-button class="tijiao" type="primary" @click="tijaio"
            >提交</el-button
          >
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      checked: false,
      checked1: true,
      chacked: true,
      a: false,
      ab: false,
      abc: false,
      abcd: false,
      abcde: false,
      abcdef: false,
      abcdefg: false,

      input1: "",
      input2: "",
      input3: "",
      input4: "",
      input5: "",
      input6: "",
      input7: "",
      input8: "",
      input9: "",
      input10: "",
    };
  },
  methods: {
    //   open(){
    // if(this.checked==true){
    //   this.input1=''
    // }else{
    //   this.input1=this.input1
    // }

    //   },
    //判断点击事件
    tijaio() {
      if(this.input1,this.input2,this.input7,this.input9==""){
        this.$message.error("请输入内容");
      } else {
        this.$axios({
          url: "/vip/growth/add",
          params: {
            login: this.input1,
            register: this.input2,
            information: this.input3,
            buy: this.input4,
            amountMet: this.input5,
            amountMetGrowth: this.input6,
            percent: this.input7,
            share: this.input8,
            invitation: this.input9,
            sign: this.input10,
          },
        }).then((res) => {
          console.log(res);
            this.$message.success("提交成功");
            this.aa();
        });
      }
    },
    //让input框的默认值为空
    aa() {
      this.input1 = "";
      this.input2 = "";
      this.input3 = "";
      this.input4 = "";
      this.input5 = "";
      this.input6 = "";
      this.input7 = "";
      this.input8 = "";
      this.input9 = "";
      this.input10 = "";
    },
  },
};
</script>

<style lang="less" scoped>
.tijiao {
  margin-left: 350px;
  margin-top: 25px;
}
.bunn {
  line-height: 45px;
}
.ju-li {
  margin: 10px 0px;
}
.dlhq {
  margin-left: 320px;
}
.ypt {
  width: 200px;
  margin-bottom: 15px;
}
</style>